<script setup>
import {
  onActivated,
  onBeforeMount,
  onBeforeUnmount,
  onBeforeUpdate,
  onDeactivated,
  onMounted,
  onUnmounted,
  onUpdated
} from "vue";

onBeforeMount(() => {
      console.log("Comp3 组件 before mount");
    }
)

onMounted(() => {
      console.log("Comp3 组件 mounted");
    }
)

onBeforeUpdate(() => {
      console.log("Comp3 组件 before update");
    }
)

onUpdated(() => {
      console.log("Comp3 组件 updated");
    }
)

onBeforeUnmount(() => {
      console.log("Comp3 组件 before unmount");
    }
)

onUnmounted(() => {
      console.log("Comp3 组件 unmounted");
    }
)

onActivated(() => {
      console.log("Comp3 组件 activated");
    }
)

onDeactivated(() => {
      console.log("Comp3 组件 deactivated");
    }
)

</script>

<template>
  <h1>这是组件 2</h1>
</template>

<style scoped>

</style>